<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    #result {
      width: 200px;
      height: 200px;
      border: solid 1px #903;
    }
  </style>
</head>
<body>
<div id="result"></div>
<script>
  const result = document.querySelector('#result');

  result.addEventListener("mousemove", () => {
    const xhr = new XMLHttpRequest();

    xhr.open('POST', 'http://127.0.0.1:8000/serve');

    // content-type 设置请求体内容的
    // application 参数查询字符串固定对应
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')

    xhr.send('a=100&b=200&c=300');

    xhr.onreadystatechange = () => {
      if(xhr.readyState === 4) {
        if(xhr.status >= 200 && xhr.status < 300) {
          result.innerHTML = xhr.response;
        }
      }
    }
  })
</script>
</body>
</html>